<template>
  <div>
    <commIndex
      :type="'groupManage'"
      :table-head="tableHead"
      :form-table="formItemArr"
    />
  </div>
</template>

<script>
import commIndex from '@/views/fileManage/components/commonIndex.vue'
import { setSelectItem, getSelectList } from '@/api/fileCommonApi.js'
export default {
  name: 'groupManage',
  components: {
    commIndex,
  },
  data() {
    return {
      tableHead: [
        {
          label: '站点id',
          prop: 'site_id',
          width: 120,
        },
        {
          label: '站点名称',
          prop: 'site_name',
          width: 120,
        },
        {
          label: '公司id ',
          prop: 'company_id',
          width: 200,
        },
        {
          label: '分组名称',
          prop: 'group_name',
          width: 120,
        },
        {
          label: '分组编号',
          prop: 'group_num',
          width: 120,
        },
        {
          label: '材质',
          prop: 'group_mater',
          width: 120,
        },
        {
          label: '容量',
          prop: 'group_allow',
          width: 120,
        },
      ],
      formItemArr: [
        // {
        //   label: '站点id',
        //   prop: 'site_id',
        //   rule: [{ required: true, message: '站点id不能为空' }],
        //   type: 'select',
        //   child: [],
        // },
        {
          label: '站点名称',
          prop: 'site_id',
          rule: [{ required: true, message: '站点名称不能为空' }],
          type: 'select',
          child: [],
        },
        {
          label: '分组名称',
          prop: 'group_name',
          rule: [{ required: true, message: '分组名称不能为空' }],
          type: 'input',
        },
        {
          label: '分组编号',
          prop: 'group_num',
          rule: [{ required: true, message: '分组编号不能为空' }],
          type: 'input',
        },
        {
          label: '材质',
          prop: 'group_mater',
          rule: [{ required: true, message: '站点名称不能为空' }],
          type: 'select',
          child: [],
        },
        {
          label: '容量',
          prop: 'group_allow',
          rule: [{ required: true, message: '容量不能为空' }],
          type: 'input',
        },
      ],
    }
  },
  mounted() {
    this.sortFormItem()
  },
  methods: {
    async sortFormItem() {
      // console.log('哈哈哈哈哈哈', this.formItemArr[4].type === 'select')
      // for (var i = 0; i < this.formItemArr.length; i++) {
      //   if (this.formItemArr[i].type === 'select') {
      //     // console.log(this.formItemArr[i].prop)
      //     var listdata = await this.getSelect({
      //       type: this.formItemArr[i].prop,
      //       data: { pid: 12 },
      //     })
      //     console.log('哈哈哈哈哈哈', i)
      //     // console.log(listdata)
      //     var selectArr = setSelectItem(
      //       listdata.data.data || listdata.data.dictionaries
      //     )
      //     this.formItemArr[i].child = selectArr
      //   }
      // }
      const arr = [0, 3]
      arr.forEach(async (item) => {
        var listdata = await this.getSelect({
          type: this.formItemArr[item].prop,
          data: { pid: 12 },
        })
        var selectArr = setSelectItem(
          listdata.data.data || listdata.data.dictionaries
        )
        this.formItemArr[item].child = selectArr
      })
    },
    getSelect(type) {
      return getSelectList(type)
    },
  },
}
</script>

<style scoped>
.el-row {
  margin-top: 20px;
}
.page_box {
  margin: 0 auto;
  margin-top: 30px;
  display: flex;
  justify-content: center;
}
.table_box {
  padding: 20px;
}
</style>
